<template>
  <el-card class="box-card">
    <el-tabs tab-position="left" v-model="tabIndex">
      <el-tab-pane label="加载动画" name="1">
        <q1 v-if="tabIndex === '1'"></q1>
      </el-tab-pane>
      <el-tab-pane label="文字渐出" name="2">
        <q2 v-if="tabIndex === '2'"></q2>
      </el-tab-pane>
      <el-tab-pane label="按钮位置" name="3">
        <q3 v-if="tabIndex === '3'"></q3>
      </el-tab-pane>
      <el-tab-pane label="风扇相册" name="4">
        <q4 v-if="tabIndex === '4'"></q4>
      </el-tab-pane>
      <el-tab-pane label="六面体相册" name="5">
        <q5 v-if="tabIndex === '5'"></q5>
      </el-tab-pane>
    </el-tabs>
  </el-card>
</template>

<script>
import q1 from './1/Index'
import q2 from './2/Index'
import q3 from './3/Index'
import q4 from './4/Index'
import q5 from './5/Index'
export default {
  components: {
    q1, q2, q3, q4, q5
  },
  data () {
    return {
      tabIndex: '1'
    }
  },
  methods: {
  }
}
</script>

<style lang="less" scoped>

</style>
